<template>
  <div class="tem_child">
    <h3>孙组件B</h3>
    <p class="inject_data">{{ provide2 }}</p>
    <p>boo: {{ boo }}</p>
    <p>grandsonB的$attrs: {{ $attrs }}</p>
    <grandsonC v-bind="$attrs" v-on="$listeners"></grandsonC>
  </div>
</template>

<script>
import grandsonC from "./grandsonC";

export default {
  name: "grandsonB",
  components: {
    grandsonC
  },
  inheritAttrs: false,
  props: {
    boo: String
  },
  inject: ['provide1', 'provide2'],
  created() {
    console.log('grandsonB', this.$attrs); // {"coo": "CSS", "doo": "Vue", "title": "前端工匠" }
    let res = this.$listeners.parentEvent();
    console.log("grandsonB", res)
  }
}
</script>

<style scoped>
.inject_data {
  color: red;
}
</style>
